import * as Matter from 'matter-js';
import * as PIXI from "pixi.js";
import { App } from '../system/App';
import { BASE_PATH } from "@/config";
// [10]

// [/10]

export class BasketNet {
  constructor(x, y) {
    this.width = App.config.basket.rim.width - 20;
    this.height = this.width * 2;

    this.dx = 5;
    // this.createSprite(x, y);
    // this.tail = this.createNet(x, y);
    this.tail = this.createNet(x, y);
    // this.tail.gotoAndPlay(1)
    // this.createBody(x, y);

    this.options = {
      isStatic: true,
      render: {
        visible: true,
        fillStyle: 'yellow',
      }
    }
  }



  createBody(x, y) {
    let cloth = this.createCloth(x, y, 5, 5, 5, 5, false, 8);

    for (let i = 0; i < 20; i++) {
      cloth.bodies[i].isStatic = true;
    }

    Matter.World.add(App.physics.world, cloth);
  }

  createCloth(xx, yy, columns, rows, columnGap, rowGap, crossBrace, particleRadius, particleOptions, constraintOptions) {
    var Body = Matter.Body,
      Bodies = Matter.Bodies,
      Common = Matter.Common,
      Composites = Matter.Composites;

    var group = Body.nextGroup(true);
    particleOptions = Common.extend({
      inertia: Infinity,
      friction: 0.00001,
      collisionFilter: {group: group},
      render: {visible: false}
    }, particleOptions);
    constraintOptions = Common.extend({stiffness: 0.06, render: {type: 'line', anchors: false}}, constraintOptions);

    var cloth = Composites.stack(xx, yy, columns, rows, columnGap, rowGap, function (x, y) {
      return Bodies.circle(x, y, particleRadius, particleOptions);
    });

    Composites.mesh(cloth, columns, rows, crossBrace, constraintOptions);

    cloth.label = 'Cloth Body';

    return cloth;
  }

  createSprite(x, y) {
    this.sprite = App.sprite(`basket_net_right`);
    this.sprite.x = x;
    this.sprite.y = y;
    this.sprite.width = this.width;
    this.sprite.height = this.height;
  }

  createNet = (x, y) => {
    const expFrames = [];
    for (let i = 1; i <= 11; i++) {
      expFrames.push(`keyf-${i}`)
    }
    this.animatedSprite = PIXI.AnimatedSprite.fromFrames(expFrames);
    this.animatedSprite.position.x = x;
    this.animatedSprite.position.y = y - this.height / 2;
    this.animatedSprite.width = this.width;
    this.animatedSprite.height = this.height;
    // this.animatedSprite.anchor.set(0.5);
    this.animatedSprite.loop = false;
    this.animatedSprite.animationSpeed = 2;
    return this.animatedSprite;
  }

  play = () => {
    this.tail.gotoAndPlay(0);
  }

  // 06
  move(dx) {
  }

}